
import Fetch from '../modules/fetch'
import store from '../flux/store'
import actions from '../flux/actions'
//https://restapi.ele.me/bgs/poi/search_poi_nearby?keyword=%E4%B8%8A%E6%B5%B7&offset=0&limit=20&longitude=116.474306&latitude=39.830622
class PositionComponent extends React.Component {   
    constructor(props,context){
        super(props,context)

        this.state={
           search_word:'',
           check_list:[],
           position_info:store.getPositionInfo()
        }
    }
    componentDidMount(){
    	let that = this
    	store.addPositionChangeListener(()=>{
    		that.setState({
	            position_info:store.getPositionInfo()
	       	})
    	})
    }
    changeWord(e){
    	this.setState({search_word:e.target.value})
    }
    searWord(e){
    	e.preventDefault()
		let that = this
		let {latitude=39.830622,longitude=116.474306} = that.state.position_info
		Fetch.Get('http://localhost:9000/ele/bgs/poi/search_poi_nearby',{
			offset:0,limit:20,longitude:longitude,latitude:latitude,
			keyword:that.state.search_word
		}).then(res=>res.json()).then(json=>{
			console.log(json)
			that.setState({check_list:json})
		})

    }
    showCheckList(){
    	let that = this;
    	let arr=[]
    	this.state.check_list.forEach((item,i)=>{
    		arr.push(<li onClick={this.changePosition.bind(this,i)}>
               			<h4>{item.name}</h4>
               			<p>{item.address}</p>
               		</li>)
    	})
    	return arr
    }
    changePosition(i){
    	//点击li的时候，获取到这个li所表示的位置信息，调用actions的方法，并作跳转
    	let _info = this.state.check_list[i]
    	let info = {
    		latitude:_info.latitude,
    		longitude:_info.longitude,
    		address:_info.name
    	}
    	actions.changePosition(info)
    	location.hash='/waimai'
    }
    render(){
        
        return (
            <div className="full-height position-box">
               <header>
               	  <span>返回</span>
               	  选择收货地址
               </header>
               
               <form onSubmit={this.searWord.bind(this)} className="poi-3jipw_0">
               <img src="" className="poi-2wSRi_0"/>
               <input onChange={this.changeWord.bind(this)}  type="search" placeholder="请输入地址" autofocus="autofocus" className="poi-i4JjZ_0"/>
               </form>
               <ul>
               		{this.showCheckList()}
               </ul>
            </div>
        )
    }
}
//定义默认属性
PositionComponent.defaultProps={

}



export default PositionComponent